<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
		<script src="js/bootstrap.js"></script>
		<script src="js/animate.js"></script>
		<link rel="stylesheet" href="css/bootstrap.css" />
		<link rel="stylesheet" href="css/animate.min.css" />
		<title></title>
		<style>
			* {
				font-family: "微软雅黑";
				list-style: none;
				padding: 0;
				margin: 0;
			}
			
			.nav1 {
				border-bottom: 1px solid gainsboro;
				margin: 0 !important;
			}
			
			.nav2 {
				margin: 0 !important;
			}
			
			h5 {
				background: orange;
				width: 100px;
				height: 30px;
				margin: 0 auto;
				line-height: 30px;
				margin-bottom: 10px;
			}
			
			#aa div{
				width: 100%;
				height: 100%;
				background: black;
				overflow: hidden;
			}
			#aa li{
				padding: 2px !important;
				position: relative;
			}
			#aa img {
				width: 100%;
				height: 100%;
				transform-origin: center center;
				transition-duration: 1s;
			}
			#aa img:hover {
				transform: scale(1.1, 1.1);
				opacity: 0.4;
			}
			.carousel-caption{
				 animation: bounceInUp 2s;
			}
			h3{
				position: absolute;
				z-index: 3;
				color: white;
				left: 10px;
			}
			h6{
				color: white;
				position: absolute;
				left: 40%;
				top: 50%;
				display: none;
			}
			.aside{
				width: 100%;
				/*height: 300px;*/
				background: gainsboro;
				margin-top: 10px;
				/*padding-top:20px ;*/
			}
			#bb{
				margin-top: 20px;
			}
			#bb li{
				/*padding: 0px !important;*/
			}
			#bb img{
				width: 100%;
				height: 100%;
			}
			.ww{
				margin-top: 16px;
			}
			.wrap{
				width: 100%;
				height: 200px;
				background: white;
				padding-top:30px;
				text-align: center;
			}
			.foot>li{
				margin: 6px 0;
				color: gainsboro;
				text-align: center;
			}
			@media only screen and (max-width:760px ) {
				.foot{
					display: none;
				}
			}
			.footer>div{
				height: 80px;
				line-height: 80px;
				text-align: center;
				padding-bottom:30px;
			}
		</style>
	</head>

	<body>
		<nav class="navbar nav1">
			<div class="container-fluid">
				<div class="navbar-header">
					<!--<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>-->
					<div><img src="img/10.jpg"></div>
				</div>
				<div class="collapse navbar-collapse bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav navbar-right">
						<li>
							<a href="#">联系我们</a>
						</li>
						<li>
							<a href="#">简体中文</a>
						</li>
					</ul>
				</div>
			</div>
		</nav>

		<nav class="navbar navbar-default nav2">
			<div class="container-fluid">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
					<a class="navbar-brand" href="#">首页</a>
				</div>
				<div class="collapse navbar-collapse bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav">
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">关于我们<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li>
									<a href="#">企业简介</a>
								</li>
								<li>
									<a href="#">投资者</a>
								</li>
								<li>
									<a href="#">核心优势</a>
								</li>
								<li>
									<a href="#">团队介绍</a>
								</li>
							</ul>
						</li>
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">行业洞察<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li>
									<a href="#">大象新闻</a>
								</li>
								<li>
									<a href="#">市场咨询</a>
								</li>
							</ul>
						</li>
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">产品与解决法案<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li>
									<a href="#">电子发票</a>
								</li>
								<li>
									<a href="#">手机开发票</a>
								</li>
								<li>
									<a href="#">发票保险</a>
								</li>
								<li>
									<a href="#">发票摇奖</a>
								</li>
								<li>
									<a href="#">保险</a>
								</li>
								<li>
									<a href="#">电子公司</a>
								</li>
							</ul>
						</li>
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">合作伙伴<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li>
									<a href="#">腾讯</a>
								</li>
								<li>
									<a href="#">戒牒</a>
								</li>
								<li>
									<a href="#">大放送</a>
								</li>
								<li>
									<a href="#">优势</a>
								</li>
							</ul>
						</li>
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">服务与支持<span class="caret"></span></a>
							<ul class="dropdown-menu">
								<li>
									<a href="#">服务专区</a>
								</li>
								<li>
									<a href="#">手机开发票</a>
								</li>
							</ul>
						</li>
					</ul>
					<a class="navbar-brand" href="#">加入我们</a>
					<form class="navbar-form navbar-right" role="search">
						<div class="form-group">
							<input type="text" class="form-control" placeholder="搜索">
						</div>
					</form>
				</div>
			</div>
		</nav>
		<!--轮播-->
		<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
			<!-- Indicators -->
			<ol class="carousel-indicators" id="dd">
				<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
				<li data-target="#carousel-example-generic" data-slide-to="1"></li>
				<li data-target="#carousel-example-generic" data-slide-to="2"></li>
			</ol>

			<!-- Wrapper for slides -->
			<div class="carousel-inner" role="listbox">
				<div class="item active">
					<img src="img/banner-1.jpg" alt="...">
					<div class="carousel-caption">
						<h1> 打造百亿市场经济</h1>
						<h4>服务一万人们</h4>
						<h5>了解更多</h5>
					</div>
				</div>
				<div class="item">
					<img src="img/banner-1.jpg" alt="...">
					<div class="carousel-caption">
						<h1> 打造百亿市场经济</h1>
						<h4>服务一万人们</h4>
						<h5>了解更多</h5>
					</div>
				</div>
				<div class="item">
					<img src="img/banner-1.jpg" alt="...">
					<div class="carousel-caption">
						<h1> 打造百亿市场经济</h1>
						<h4>服务一万人们</h4>
						<h5>了解更多</h5>
					</div>
				</div>
			</div>

			<!-- Controls -->
			<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
				<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
				<span class="sr-only">Previous</span>
			</a>
			<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
				<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
				<span class="sr-only">Next</span>
			</a>
		</div>
		<!--内容-->

		<div class="container">
			<ul class=" col-md-12" id="aa">
				<li class=" col-md-4 col-xs-12 col-sm-4">
					<h3>关于我们</h3>
					<div>
						<img src="img/img-01.jpg" />
						<h6>亿万互联网，行业竞争</h6>
					</div>

				</li>
				<li class=" col-md-4 col-xs-12 col-sm-4">
					<h3>行业洞察</h3>
					<div>
						<img src="img/guanyuwomen.jpg" />
						<h6>亿万互联网，行业竞争</h6>
					</div>
				</li>
				<li class=" col-md-4 col-xs-12 col-sm-4">
					<h3>产品与解决法案</h3>
					<div>
						<img src="img/img-03.jpg" />
						<h6>亿万互联网，行业竞争</h6>
					</div>
				</li>
				
				<li class="col-md-4 col-xs-12 col-sm-4">
					<h3>服务与支持</h3>
					<div>
						<img src="img/img-04.jpg" />
						<h6>亿万互联网，行业竞争</h6>
					</div>
				</li>
				<li class=" col-md-4 col-xs-12 col-sm-4">
					<h3>合作伙伴</h3>
					<div>
						<img src="img/img-05.jpg" />
						<h6>亿万互联网，行业竞争</h6>
					</div>
				</li>
				<li class=" col-md-4 col-xs-12 col-sm-4">
					<h3 style="color: black;">加入我们</h3>
					<div>
						<img src="img/img-06.jpg" />
						<h6>亿万互联网，行业竞争</h6>
					</div>
				</li>
			</ul>
		</div>
		
			<div class="aside">
			<div class="container">
			<ul class="col-md-12" id="bb">
				<li class="col-md-4 col-xs-12 col-sm-4">
					<div>
						<a href="#" style="font-size: 30px;">新闻</a>
						<p class="ww"><a href="#">大象慧云信息科技有限公司办公区装饰项目中目标结果公式</a></p>
						<p class="ww"><a href="#">大象慧云信息科技有限公司办公区装饰项目中目标结果公式</a></p>
						<p class="ww"><a href="#">大象慧云信息科技有限公司办公区装饰项目中目标结果公式</a></p>
					</div>
				</li>
				<li class="col-md-4 col-xs-12 col-sm-4">
					<div>
						<img src="img/6.jpg" />
						<a href="#">大象慧云信息科技有限公司办公区装饰项目中目标结果公式</a>
					</div>
				
				</li>
				<li class="col-md-4 col-xs-12 col-sm-4">
					<div>
						<img src="img/6.jpg" />
						<a href="#">大象慧云信息科技有限公司办公区装饰项目中目标结果公式</a>
					</div>
				</li>
			</ul>
		</div>
		</div>
		<div class="wrap">
			<li class="col-md-1"></li>
			<li class="col-md-1"></li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1 col-xs-6 col-sm-4">关于我们
				<ul class="foot">
					<li>企业简介</li>
					<li>投资者</li>
					<li>核心优势</li>
					<li>团队介绍</li>
					
				</ul>
			</li>
			<li class="col-md-1"></li>
			<li class="col-md-1"></li>
		</div>
		<div class="footer">
			<div class="col-md-6 col-xs-12">
				<img src="img/10.jpg" />
			</div>
			<div class="col-md-6 col-xs-12">
				Copyright©2016大象慧云 版权所有 
			</div>
		</div>
	</body>
    <script>
      $("#aa>li").hover(function(){
      	$(this).find("h6").fadeIn(1000)
      },function(){
      	$(this).find("h6").fadeOut(1000)
      })
    </script>
</html>